<template>
	<view >
		
			<!-- teacher-01开始 -->
			<view class="index-list">
				<!-- 头像开始 -->
				<view class="index-list1">
					<view >
						<image :src="item.userPic"
						 mode="widthFix" lazy-load></image>
						 <view >{{item.userName}}</view>
					</view>
					<view >
						
						
					</view>
				</view>	
					<!-- 头像结束 -->
					<!-- 标题、内容开始 -->
				<view class="index-list2">{{item.title}}</view>	
				<view class="index-list3" @tap="clickTitlepic">
					<image :src="item.titlePic" 
					mode="widthFix" lazy-load></image>
				</view>	
				<!-- 标题、内容结束 -->
				<!-- 点赞、评论、分享开始 -->
				<view class="index-list4">
				<!-- 点赞开始 -->
					<view :class="{'active':(item.ifonum.index==1)}">
					<view class="icon iconfont iconzan"></view>
						<view>{{item.ifonum.praiseNum}}</view>
					</view>
					<!-- 点赞结束 -->
				<!-- 评论开始 -->
					<view>
						<view class="icon iconfont iconpinglun" @tap="clickComment"></view>
						<view>{{item.commentNum}}</view>
					</view>
					<!-- 评论结束 -->
				<!-- 分享开始 -->
					<view>
						<view class="icon iconfont iconzhuanfa">
						</view>
						<view>{{item.shareNum}}</view>
					</view>
					<!-- 分享结束 -->
				</view>	
				<!-- 点赞、评论、分享结束 -->
			</view>	
			
			<!-- teacher-01结束 -->
		
		
		<view>nmslsb</view></view><!-- 嘴臭开始，嘴臭结束 -->
	</view>
</template>

<script>
export default{
	props:{
		item:Object,
		index:Number
	},
	methods:{

		clickComment:function()
		{
			   this.$emit("ClickComment");
		},
		clickTitlepic:function()
		{
			   this.$emit("ClickTitlePic");
		},
	}
	
}
</script>

<style>
	
	.index-list{
		border-bottom: 1upx solid #FFFFFF;
		padding:20upx;
		background-color: #fedfd8;
		
	}
	.index-list1{
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.index-list1>view:first-child
	{
		display: flex;
		align-items: center;
		
	}
	.index-list1>view:first-child image
	{
		width: 100upx;
		height: 100upx;
		border-radius: 100%;
		margin-right: 10upx;
		
	}
	.index-list1>view:first-child view
	{

		margin-left: 10upx;
		color: #999999;
	}
	.index-list1>view:last-child
	{
		
	}
	.index-list2{
		padding: 15upx;
		font-size: 32upx;
	}
	.index-list3{
		
	}
	.index-list3>image{
		width: 100%;
		border-radius: 20upx;
	}
	.index-list4 {
	    color:#999999 ;
	}
	.index-list4{
		padding: 20upx 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.index-list4>view{
		display: flex;
		
		align-items: center;
	}
	.index-list4>view>view:first-child {
		
		font-size: 40upx;
		
	}
	.active{
		color: #ffaa7f;

	}

</style>
